{% from '__marcro.html' import static %}
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>在线聊天登陆/注册</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <script src="{{ url_for("static",filename='js/sock_io.js') }}"></script>
    <script type="text/javascript" src="{{ url_for("static",filename='js/my_js/chat.js') }}"></script>
    <script src="{{ static("js/my_js/zlajax.js") }}"></script>
    <script src="{{ static("js/my_js/login.js") }}"></script>
    <link rel="stylesheet" href="{{ static("css/login.css") }}">
</head>
<body>
<div class="htmleaf-container">
	<p class="center">登录用户名为：17sucai.com，密码为17sucai.com</p>
	<div class="center alert alert-danger" role="alert"></div>
	<div class="center alert alert-success" role="alert"></div>
	<div id="wrapper" class="login-page">
	  <div id="login_form" class="form">
		<form class="register-form">
		  <input type="text" placeholder="用户名" id="r_user_name" name="r_user_name"/>
		  <input type="password" placeholder="密码" id="r_password" name="r_password" />
		  <button id="create">创建账户</button>
		  <p class="message">已经有了一个账户? <a href="#">立刻登录</a></p>
		</form>

		<form class="login-form">
		  <input type="text" placeholder="用户名" id="user_name" name="username"/>
		  <input type="password" placeholder="密码" id="password" name="password"/>
		  <button id="submitBtn">登　录</button>
		  <p class="message">还没有账户? <a href="#">立刻创建</a></p>
		</form>
	  </div>
	</div>
</div>

<script type="text/javascript">
$(function(){
	$('.message a').click(function () {
		$('form').animate({
			height: 'toggle',
			opacity: 'toggle'
		}, 'slow');
	});
})
</script>

</body>
</html>